<div class="root">
    <!--导航栏-->
    <div class="tab-bar">
        <div :class="['tab-item', index == tabItems.length -1 ? 'tab-item-last' : '']" v-for="(t,index) in tabItems" @click="tabItemOnClick(t)">
            <image v-if="selectedIndex == t.index" resize="cover" class="tab-icon" :src="positionIcon"></image>
            <text :class="['tab-title', selectedIndex == t.index ? 'tab-title-active' : 'tab-title-common']">{{t.title}}</text>
        </div>
    </div>

    <!--免密支付说明-->
    <div class="msg-wrapper" v-if="selectedIndex == 0">
        <text class="msg font-msyhl" @click="goToSignMsg">免密支付说明</text>
    </div>

    <!--tab选项卡-->
    <slider class="slider" infinite=false :index="selectedIndex" auto-play="false" @change="change($event)">

        <embed type="weex" v-for="(item , i) in tabItems"
               :src="item.src"
               :key="i"
               :style="{visibility: item.visibility}"
               class="content">
        </embed>

    </slider>

</div>